<template>
  <view class="container">
    <view class="form-item">
      <text class="label">姓名</text>
      <input class="input" placeholder="请输入姓名" v-model="emergencyContact.name" />
    </view>
    <view class="form-item">
      <text class="label">电话号码</text>
      <input class="input" placeholder="请输入电话号码" type="number" v-model="emergencyContact.phone" />
    </view>
    <button class="submit-button" @click="submitForm">保存</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      emergencyContact: {
        name: '',  // 默认为空，从后端获取
        phone: ''   // 默认为空，从后端获取
      }
    };
  },
  onLoad() {
    // 页面加载时从后端获取紧急联系人信息
    this.getEmergencyContact();
  },
  methods: {
    getEmergencyContact() {
      // 假设后端API为 /api/emergency-contact
      uni.request({
        url: '/api/emergency-contact',
        method: 'GET',
        success: (res) => {
          if (res.statusCode === 200) {
            this.emergencyContact = res.data;
          }
        },
        fail: (err) => {
          console.error('获取紧急联系人信息失败', err);
        }
      });
    },
    submitForm() {
      // 在这里处理表单提交逻辑，例如发送到服务器或本地存储
      console.log('姓名：', this.emergencyContact.name);
      console.log('电话号码：', this.emergencyContact.phone);
      // 更新后端紧急联系人信息
      this.updateEmergencyContact();
    },
    updateEmergencyContact() {
      // 假设后端API为 /api/emergency-contact
      uni.request({
        url: '/api/emergency-contact',
        method: 'PUT',
        data: this.emergencyContact,
        success: (res) => {
          if (res.statusCode === 200) {
            uni.showToast({
              title: '信息已保存',
              icon: 'success'
            });
			uni.switchTo({
				url:('pages/mine/index')
			})
          } else {
            uni.showToast({
              title: '保存失败',
              icon: 'none'
            });
          }
        },
        fail: (err) => {
          console.error('更新紧急联系人信息失败', err);
          uni.showToast({
            title: '更新失败',
            icon: 'none'
          });
        }
      });
    }
  }
};
</script>
<style scoped>
.container {
  padding: 20px;
  background-color: #ffffff;
}
.form-item {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
}
.label {
  font-size: 16px;
  color: #333;
  margin-right: 10px;
}
.input {
  flex: 1;
  padding: 10px;
  border: 1px solid #cccccc;
  border-radius: 4px;
  font-size: 16px;
}
.submit-button {
  width: 100%;
  padding: 10px 0;
  background-color: #007aff;
  color: white;
  text-align: center;
  font-size: 18px;
  border-radius: 5px;
}
</style>